<include file="../header" />
<body>
<div class="wraper">
	<div class="load">
		<img class="load-bee" src="/assets/repairhsd/images/load-bee.png"/>
	</div>
    <div class="top">
        <p class="">
        	<a href="{BEESCRM::U('repairhsd/repairhsd/index',array('repairId'=>$repairId,'type'=>$type))}" class="iconfont icon-zuo fl-left"></a>
        	<span class="fl-left">订单详情</span>
        	<a href="{BEESCRM::U('repairhsd/repairhsd/index',array('repairId'=>$repairId,'type'=>$type))}" class="iconfont icon-shouye text-right fl-right"></a>
        </p>
    </div>
    <p class="title">报修单号</p>
    <p class="list" style="margin-bottom: 10px;">{BEESCRM:$data.order_sn}</p>
	<!--已下单-->
	<div class="dialog clearfix">
        <span class="left-big"></span>
        <span class="left-middle"></span>
        <p>
        	<span class="circle gray"></span>已下单<span class="time fl-right">{BEESCRM:$data.create_time|date='Y-m-d H:i',###}</span>
        </p>
        <if condition="$data['order_type'] neq 4">
        	<p><span>报修人：</span> {BEESCRM:$data['real_name']|mb_substr=0,1,'utf8'}某某</p>
        </if>
        <if condition="$data['mobile']"><p><span>联系电话：</span> <a href="tel://{BEESCRM:$data.mobile}">{BEESCRM:$data.mobile}</a></p></if>
        <p><span>报修区域：</span> {BEESCRM:$data.community_name}</p>
        <p><span>报修地址：</span> {BEESCRM:$data.building_name}{BEESCRM:$data.room_name}{BEESCRM:$data.detail_address}</p>
        <p><span>报修内容：</span> {BEESCRM:$data.content}</p>
        <P><span>报修项目：</span> {BEESCRM:$project_name}　　{BEESCRM:$project_child_name}</P>
        <if condition="$imageList">
	        <volist name="imageList" id="vo">
	        	<if condition="$vo['type'] eq 0"><img class="picture fl-left" src="{BEESCRM:$vo.url}"/></if>
	        </volist>
	    </if>

	    <if condition="$data['status'] eq 2">
			<a href="javascript:;" class="confirm fl-right" id="confirm">确认接单</a>
		</if>
    </div>

    <!--已接单-->
    <if condition="$data['status'] egt 3">
		<div class="dialog clearfix">
	        <span class="left-big"></span>
	        <span class="left-middle"></span>
	        <p>
	        	<span class="circle gray"></span>已接单<span class="time fl-right">{BEESCRM:$data.confirm_time|date='Y-m-d H:i',###}</span>
	        </p>
	        <p><span>受理人：</span> {BEESCRM:$repairman['real_name']|mb_substr=0,1,'utf8'}师傅</p>
	        <p><span>受理人电话</span> <a href="tel://{BEESCRM:$repairman.mobile}">{BEESCRM:$repairman.mobile}</a></p>
	        <P><span>处理说明:</span>{BEESCRM:$data.send_remark}</P>
	    </div>
	</if>

	<!--待维修-->
	<if condition="$data['status'] eq 3">
		<div class="dialog clearfix">
			<span class="right-big"></span>
			<span class="right-middle"></span>
			<p>
				<span class="circle green"></span>待维修
			</p>
			<p><span>完工操作：</span>  {BEESCRM:$repairman['real_name']|mb_substr=0,1,'utf8'}师傅　工号：{BEESCRM:$repairman['number']}</p>
			<p><span>完工说明：</span></p>

			<div class="upload-img clearfix">
				<div class="imgbox fl-left"><span id="pic_span"></span></div>
				<div class="add-img fl-left" >
					<input class="file-input" type="file" accept="image/*" name="upload-file" id="fileupload_input"/>
					<span class="iconfont icon-tianjia tianjia"></span>
				</div>
			</div>
			<p class="form-box">
				<textarea class="textarea" placeholder="完工说明描述" id="finish_remark"></textarea>
			</p>

			<div class=" clearfix" style="text-align:center">
				<a href="javascript:void(0)" class="submit confirm" id="finish_submit">提交完成</a>
			</div>
		</div>
	</if>

    <!--已维修-->
	<if condition="$data['status'] eq 4">
		<div class="dialog clearfix">
			<span class="left-big"></span>
			<span class="left-middle"></span>
			<p>
				<span class="circle gray"></span>已维修<span class="time fl-right">{BEESCRM:$data.finish_time|date='Y-m-d H:i',###}</span>
			</p>
			<p><span>维修工：</span><if condition="$repairman['real_name'] neq '' ">{BEESCRM:$repairman['real_name']|mb_substr=0,1,'utf8'}师傅　工号：{BEESCRM:$repairman['number']}</if></p>
			<if condition="$imageList">
			<div class="imgs-box clearfix">
				<volist name="imageList" id="v1">
					<if condition="$v1['type'] eq 2"><img style="width:50px;height:50px;" class="picture fl-left" src="{BEESCRM:$v1.url}"/></if>
				</volist>
			</div>
			</if>
			<P class="list"><span>完工说明:</span>{BEESCRM:$data.finish_remark}</P>
		</div>
	</if>

	<if condition="$data['status'] eq 4 and $data['need_pay'] eq 1">
		<div class="dialog clearfix">
			<span class="left-big"></span>
			<span class="left-middle"></span>
			<p>
				<span class="circle gray"></span>待用户支付
			</p>
			<p>
				
			</p>
		</div>
	</if>

	<if condition="$data['status'] egt 5 and $data['need_pay'] eq 1">
		<div class="dialog clearfix">
			<span class="left-big"></span>
			<span class="left-middle"></span>
			<p>
				<span class="circle gray"></span>已支付
			</p>
			<p><span>支付方式:</span>微信支付</p>
        	<p><span>支付金额:</span>{BEESCRM:$data['order_amount']}元</p>
		</div>
	</if>

	<if condition="($data['status'] eq 4 and $data['need_pay'] eq 0) or ($data['status'] eq 5 and $data['need_pay'] eq 1)">
		<div class="dialog clearfix">
			<span class="left-big"></span>
			<span class="left-middle"></span>
			<p>
				<span class="circle gray"></span>用户未评价
			</p>
			<div class="grade">
            <p class="stars-list">响应时间
                <span class="iconfont icon-xingxing star gray-star quality"></span>
                <span class="iconfont icon-xingxing star gray-star quality"></span>
                <span class="iconfont icon-xingxing star gray-star quality"></span>
                <span class="iconfont icon-xingxing star gray-star quality"></span>
                <span class="iconfont icon-xingxing star gray-star quality"></span>
                <span class="level"></span>
            </p>
            <p class="stars-list">维修质量
                <span class="iconfont icon-xingxing star gray-star service"></span>
                <span class="iconfont icon-xingxing star gray-star service"></span>
                <span class="iconfont icon-xingxing star gray-star service"></span>
                <span class="iconfont icon-xingxing star gray-star service"></span>
                <span class="iconfont icon-xingxing star gray-star service"></span>
                <span class="level"></span>
            </p>
            <p class="stars-list">服务态度
                <span class="iconfont icon-xingxing star gray-star image"></span>
                <span class="iconfont icon-xingxing star gray-star image"></span>
                <span class="iconfont icon-xingxing star gray-star image"></span>
                <span class="iconfont icon-xingxing star gray-star image"></span>
                <span class="iconfont icon-xingxing star gray-star image"></span>
                <span class="level"></span>
            </p>
        	</div>
		</div>
	</if>

	<if condition="$data['status'] egt 6">
		 <div class="dialog clearfix">
			<span class="left-big"></span>
			<span class="left-middle"></span>
			<p>
				<span class="circle green"></span>
				已评价
			</p>
			<p><span>用户评价：</span> {BEESCRM:$data.comment}</p>
			<p><span>服务星级：</span></p>
			<p>
	            响应时间
	            <for start="0" end="$data['quality_star']">
	                <span class="iconfont icon-xingxing star small"></span>
	            </for><for start="$data['quality_star']" end="5">
	            <span class="iconfont icon-xingxing star small gray-star"></span>
	        	</for>
        	</p>
	        <p>维修质量
	            <for start="0" end="$data['service_star']">
	                <span class="iconfont icon-xingxing star small"></span>
	            </for><for start="$data['service_star']" end="5">
	                <span class="iconfont icon-xingxing star small gray-star"></span>
	            </for>
	        </p>
	        <p>服务态度
	            <for start="0" end="$data['image_star']">
	                <span class="iconfont icon-xingxing star small"></span>
	            </for><for start="$data['image_star']" end="5">
	                <span class="iconfont icon-xingxing star small gray-star"></span>
	            </for>
	        </p>
	        
		</div>
	</if>
</div>

<include file="../commonJS" />
<script type="text/javascript" src="/assets/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/assets/bower_components/upload/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/assets/bower_components/upload/jquery.fileupload.js"></script>
<script type="text/javascript" src="/assets/bower_components/upload/jquery.iframe-transport.js"></script>
<script src="/assets/repairhsd/js/fastclick.min.js"></script>
<script>
	$(function(){
		//FastClick.attach(document.body);
		var localObj = window.sessionStorage;
		var psUrl = localObj.getItem('psUrl_{BEESCRM:$data.order_id}');
		//console.log(psUrl)
		if(psUrl){
			$('#ps').html('<img style="width:50px;height:50px;" id="photo" src="'+psUrl+'"/>');
		}
		$('#cancel').click(function(){
			$('.layer-wraper').show();
		})

		$('.cancel').click(function(){
			$('.layer-wraper').hide();
		})

		$("#fileupload_input").fileupload({
			url:"/base/common/upload",//文件上传地址，当然也可以直接写在input的data-url属性内
			done:function(e,result){
				//done方法就是上传完毕的回调函数，其他回调函数可以自行查看api
				//注意result要和jquery的ajax的data参数区分，这个对象包含了整个请求信息
				//返回的数据在result.result中，假设我们服务器返回了一个json对象
				var data=$.parseJSON(result.result);
				if(data.status=='S'){
					//$('#picture').attr('src',data.url);
					$('#pic_span').html('<img style="width:50px;height:50px;" src='+data.url+'  id="picture"/>')
				}else{
					$.alert('error',data.message);
				}
			}
		});


		
		//确认订单
		$(document).on('click','#confirm',function(){
			$.ajax({
				type:'post',
				url:"{BEESCRM::U('repairhsd/repairhsdReceive/orderConfirm',array('repairId'=>$repairId))}",
				dataType:'json',
				data:{
					'order_id':"{BEESCRM:$data.order_id}"
				},
				success:function(data){
					if(data.status=='S'){
						$.alert('success',data.message);
						setTimeout(function(){
							window.location.reload();
						},2000);
					}else{
						$.alert('error',data.message);
					}
				},
				error:function(){
					$.alert('error','通讯失败，请稍后再试');
				}
			});
		});

		
		
		//确认完工
		$(document).on('click','#finish_submit',function(){
			var data = {};
			data.order_id = "{BEESCRM:$data.order_id}";
			data.finish_remark = $('#finish_remark').val();
			if($('#order_amount').val() != '') {
				data.order_amount = $('#order_amount').val();
			}
			data.url = $('#picture').attr('src');
			if(!data.url){
				$.alert('error','请上传图片');return;
			}
			$.ajax({
				type:'post',
				url:"{BEESCRM::U('repairhsd/repairhsdReceive/orderFinish',array('repairId'=>$repairId))}",
				dataType:'json',
				data:data,
				success:function(data){
					if(data.status=='S'){
						$.alert('success',data.message);
						setTimeout(function(){
							window.location.reload();
						},2000);
					}else{
						$.alert('error',data.message);
					}
				},
				error:function(){
					$.alert('error','通讯失败，请稍后再试');
				}
			});
		});

	});

	
    //下面这个函数用来转换数组到json格式
    function arrayToJson(o) {
        var r = [];
        if (typeof o == "string") return "\"" + o.replace(/([\'\"\\])/g, "\\$1").replace(/(\n)/g, "\\n").replace(/(\r)/g, "\\r").replace(/(\t)/g, "\\t") + "\"";
        if (typeof o == "object") {
            if (!o.sort) {
                for (var i in o)
                    r.push(i + ":" + arrayToJson(o[i]));
                if (!!document.all && !/^\n?function\s*toString\(\)\s*\{\n?\s*\[native code\]\n?\s*\}\n?\s*$/.test(o.toString)) {
                    r.push("toString:" + o.toString.toString());
                }
                r = "{" + r.join() + "}";
            } else {
                for (var i = 0; i < o.length; i++) {
                    r.push(arrayToJson(o[i]));
                }
                r = "[" + r.join() + "]";
            }
            return r;
        }
        return o.toString();
    }
    //这个是调用微信图片浏览器的函数
    function imagePreview(curSrc,srcList) {
        //这个检测是否参数为空
        if(!curSrc || !srcList || srcList.length == 0) {
            return;
        }
        //这个使用了微信浏览器提供的JsAPI 调用微信图片浏览器
        WeixinJSBridge.invoke('imagePreview', {
            'current' : curSrc,
            'urls' : srcList
        });
    };

    (function($){
        //下面是获取当前页面所有的img的src 转成数组 并且 转换成json格式
        var aa=[];
        var i=0;
        var src=[];
        var json=null;
        aa=$('img');
        for (i=0;i<aa.length;i++){
            src[i]=aa[i].src;    //把所有的src存到数组里
        }
        var srcList=arrayToJson(src); //转换成json并赋值给srcList
        //下面是点击图片的时候获取当前第几个图片并且启用咱们做的调用微信图片浏览器的函数
        $('img').click(function(){
            var index = $('img').index(this);
            imagePreview(src[index],src);
        });

    })(jQuery);
</script>
</body>

</html>
